<template>
	<view>
		<view class="flex flex-column bg-white p-4" style="border-bottom: 4rpx solid #eee;width: 2000rpx;">
			<view v-if="active1" class="flex flex-column">
				<view class="flex align-center mt-1" style="width: 70%;justify-content: space-around;">
					<view v-for="(item,index) in RightTopNav" :key="index" @click="select(index)"
						:class="active==index?'active':''" class="pb-2 px-2">
						<text class="font-weight-bold font-lg">{{item.name}}</text>
						<text class="font-weight-bold font-lg" style="color: red;"> {{item.num}}</text>
					</view>
				</view>
				<!-- 交易日期 -->
				<view class="flex py-3 px-2">
					<view class="flex align-center mr-4">
						<text class="mr-1">交易开始日期:</text>
						<view style="width: 500rpx;">
							<uni-datetime-picker type="date" :clear-icon="false" v-model="single" @maskClick="maskClick" />
						</view>
					</view>
					<view class="flex align-center">
						<text class="mr-1">交易结束日期:</text>
						<view style="width: 500rpx;">
							<uni-datetime-picker type="date" :clear-icon="false" v-model="single" @maskClick="maskClick" />
						</view>
					</view>
				</view>
				<!-- 合同搜索 -->
				<view class="px-2 flex">
					<view class="mr-2" style="width: 30%;">
						<uni-data-select placeholder="请选择要搜索的编号" v-model="Selectvalue" :localdata="range"
							@change="change"></uni-data-select>
					</view>
					<view class="flex justify-between align-center pl-1"
						style="border: 2rpx solid rgb(221,221,211);width: 40%;">
						<input style="width: 80%;" type="text" placeholder-class="p-1 font-sm">
						<view class="bg-orange text-white font-sm flex justify-center align-center px-3"
							style="height: 60rpx;cursor: pointer;">
							合同搜索
						</view>
					</view>
				</view>
				<!-- 表格 -->
				<uni-table class="my-2" :loading="loading" border stripe emptyText="暂无更多数据">
					<!-- 表头行 -->
					<uni-tr>
						<uni-th  align="center">所属企业</uni-th>
						<uni-th align="center">商品信息</uni-th>
						<uni-th  align="center">商品价格</uni-th>
						<uni-th align="center">交易数量</uni-th>
						<uni-th align="center">付款方式</uni-th>
						<uni-th  align="center">交易状态</uni-th>
						<uni-th  align="center">支付阶段</uni-th>
						<uni-th width="220" align="center">交易操作</uni-th>
					</uni-tr>
					<!-- 表格数据行 -->
					<uni-tr v-for="(item,i) in GoodsData" :key="i">
						<uni-td align="center">
							<view :title="item.Enterprise_Name" class="text-ellipsis" style="width: 200rpx;">
								{{item.Enterprise_Name}}
							</view>
						</uni-td>
						<uni-td align="center">
							<view :title="item.Article_Name" class="text-ellipsis" style="width: 150rpx;">
								{{item.Article_Name}}
							</view>
						</uni-td>
						<uni-td align="center">￥{{item.Amount}}</uni-td>
						<uni-td align="center">{{item.Quantity}}{{item.Article_Unit_SerialNumber}}</uni-td>
						<uni-td align="center">{{item.Trading_Type=='0'?'全款':'按阶段付款'}}</uni-td>
						<uni-td align="center">
							<text v-if="item.Row_Status=='0'">待审核</text>
							<text v-if="item.Row_Status=='1'">待确认合同</text>
							<text v-if="item.Row_Status=='4'&&item.Seller_Status=='0'">待对方确认</text>
							<text
								v-if="item.Row_Status=='4'&&item.Seller_Status=='4'&&item.Paystages.split('/')[0]=='0'">待对方付定金</text>
							<text
								v-if="item.Row_Status=='4'&&item.Seller_Status=='4'&&item.Paystages.split('/')[0]=='1'">待发货</text>
							<text v-if="item.Row_Status=='5'">待对方收货</text>
							<text v-if="item.Row_Status=='6'&&item.Pay_Status=='0'">待对方付尾款</text>
							<text v-if="item.Row_Status=='6'&&item.Pay_Status=='1'">交易结束</text>
						</uni-td>
						<uni-td align="center">
							<view class="flex justify-center">
								<view
									:style="item_ != '0'?'background-color: rgb(0, 200, 200);':'background-color: rgb(200, 54, 56);'"
									style="color: #fff;border-radius: 10rpx;white-space: nowrap; display: inline-block; margin-left:10rpx;"
									class="p-2 mr-2" v-for="(item_,index_) in item.Collection_Amount.split('/')"
									:key="index_">{{item_!='0'?`已付款${item_}`:`第${index_+1}笔未付`}}</view>
							</view>
						</uni-td>
						<uni-td align="center">
							<view class="flex justify-center">
								<view class="flex justify-center" style="width: 85%;">
									<view class="mr-2">
										<button @click="Detail(item)" :disabled="disabled" class="uni-button"
											style="background-color: #eee;color: black;" type="primary"
											size="mini">详情</button>
									</view class="mr-2">
									<view @click="ConfirmContract(item)"
										v-if="(item.Row_Status == '1'||item.Row_Status=='4')&&item.Seller_Status!='4'">
										<button :disabled="disabled" class="uni-button" type="warn"
											size="mini">确认合同</button>
									</view>
									<view @click="Consignment(item)"
										v-if="item.Row_Status == '4' && item.Seller_Status == '4' " class="">
										<button :disabled="disabled" class="uni-button" type="primary"
											size="mini">发货</button>
									</view>
								</view>
							</view>
						</uni-td>
					</uni-tr>
				</uni-table>
				<uni-popup ref="popup" background-color="#fff" @change="change">
					<view class="popup-content" :class="{ 'popup-height': types === 'left' || types === 'right' }">
						<view class="flex flex-column p-4">
							<view class="flex align-center">
								<view class="flex align-center mr-5">
									<text class="mr-2">运输方式:</text>
									<text>{{group_seek_transaction_logistics.Transport_Type}}</text>
								</view>
								<view class="flex align-center">
									<text class="mr-2">物流信息:</text>
									<uni-easyinput v-model="group_seek_transaction_logistics.Transport_Explain"
										placeholder="请输入物流信息" />
								</view>
							</view>
							<view class="flex justify-between mt-3">
								<view class="">
				
								</view>
								<view class="flex">
									<button @click="off(0)" class="uni-button mr-2" size="mini" type="info">取消</button>
									<button @click="off(1)" class="uni-button" size="mini" type="primary">确定</button>
								</view>
							</view>
						</view>
					</view>
				</uni-popup>
			</view>
		    <view v-else class="flex flex-column">
		    	<view class="flex w-100 justify-between">
		    		<text class="font-weight-bold">商品信息</text>
		    		<view class="">
		    			<button @click="Detail(0)" size="mini" class="uni-button" type="primary">返回上一页</button>
		    		</view>
		    	</view>
				<view class="flex justify-between" style="width: 50%;">
					<view class="flex flex-column">
						<text>商品名:{{form2.Article_Name}}</text>
						<text>对方所属企业:{{form2.Enterprise_Name}}</text>
						<text>单价:￥{{form2.Amount}}/{{form2.Article_Unit_SerialNumber}}</text>
						<text>购买数量:{{form2.Acquisition_Quantity}}{{form2.Article_Unit_SerialNumber}}</text>
						<text>交易时间:{{form2.Delivery_Time}}</text>
						<text>联系人:{{form2.Contacts}}</text>
						<text>联系人手机号:{{form2.Contacts_Phone}}</text>
					</view>
				</view>
		    </view>
		</view>
		<Notify :type="type" :content="message" :show="LetterCommitment"></Notify>
	</view>
</template>

<script>
	import Notify from '@/components/Notify/Notify.vue'
	import times from '@/mixins/time.js'
	const app = getApp()
	export default {
		name: "ConsignmentOrders",
		data() {
			return {
				single: '',
				active1:true,
				active2:0,
				LetterCommitment: false,
				type: 'info',
				message: '3212',
				types: 'center',
				loading: false,
				disabled: false,
				form: {
					Type: "0",
					Group_Seek_Purchase_SerialNumber: '',
					token: "",
					Enterprise_Info_SerialNumber: "",
					page: 1, //页数
					limit: 10, //每页数据条数
				},
				form1: {},
				form2: {},
				formData: [],
				GoodsData: [],
				list2: [{
					title: '审核中',
					desc: '2023-11-04'
				}, {
					title: '已通过',
					desc: '预计2023-11-12'
				}, {
					title: '未通过',
					desc: '预计2023-11-13'
				}, {
					title: '待对方确认',
					desc: '预计2023-11-14'
				}, {
					title: '待收货',
					desc: '预计2023-11-14'
				}, {
					title: '已收货',
					desc: '预计2023-11-14'
				}],
				Selectvalue: "",
				RightTopNav: [{
						name: '所有交易',
						num: 0,
					},
					{
						name: '审核中',
						num: 0,
					},
					{
						name: '已通过',
						num: 0,
					},
					{
						name: '未通过',
						num: 0,
					},
					{
						name: '待对方确认',
						num: 0,
					},
					{
						name: '待收货',
						num: 0,
					},
				],
				range: [{
						value: 0,
						text: "合同号"
					},
					{
						value: 1,
						text: "运单号"
					},
					{
						value: 2,
						text: "对方客户名称"
					},
					{
						value: 3,
						text: "订单量"
					},
					{
						value: 4,
						text: "品种名称"
					},
					{
						value: 5,
						text: "业务相关筛选"
					},
					{
						value: 6,
						text: "可行性编号"
					},
					{
						value: 7,
						text: "框架合同编号"
					},
				],
				group_seek_transaction_logistics: {
					Group_Seek_Logistics_SerialNumber: '', //主键
					Group_Seek_Transaction_SerialNumber: '', //交易流水号
					Transport_Type: '', //运输方式
					Transport_Explain: '' //说明
				},
				active: 0,
			};
		},
		mounted(e) {
			this.form.token = uni.getStorageSync('token')
			this.form.Enterprise_Info_SerialNumber = uni.getStorageSync('enterprise')
			this.getList(this.form)
		},
		methods: {
			select(i) {
				this.active = i
			},
			change(e) {
				console.log('当前模式：' + e.type + ',状态：' + e.show);
			},
			maskClick(e) {
				console.log('maskClick事件:', e);
			},
			getList(data) {
				this.loading = true
				uni.request({ //确认招采信息
					url: app.globalData.Domain_Name + '/getGroupSeekTransactionAllAction',
					header: {
						'Content-Type': 'application/x-www-form-urlencoded'
					},
					method: "POST",
					data,
					success: (res) => {
						console.log(res)
						this.loading = false
						this.RightTopNav[0].num = res.data.limit
						this.GoodsData = res.data.tableData
					}
				})
			},
			sendmessage(value) {
				uni.request({
					url: app.globalData.Domain_Name + '/WeChatSendCustom',
					header: {
						'Content-Type': 'application/x-www-form-urlencoded'
					},
					method: "POST",
					data: {
						value
					},
					success: (res) => {}
				})
			},
			Consignment(item, type) { //发货
				this.disabled = true
				this.group_seek_transaction_logistics.Transport_Type = item.Shipment_Type
				this.group_seek_transaction_logistics.Group_Seek_Transaction_SerialNumber = item
					.Group_Seek_Transaction_SerialNumber
				let obj = {
					// 采购信息表
					group_seek_transaction: {
						group_seek_transaction_paystages: {}
					}
				}
				var token = uni.getStorageSync('token')
				uni.request({ //确认招采信息
					url: app.globalData.Domain_Name + '/getSubtableInquiryOriginal',
					header: {
						'Content-Type': 'application/x-www-form-urlencoded'
					},
					method: "POST",
					data: {
						Primary_Key: item.Group_Seek_Transaction_SerialNumber,
						JSONObject: JSON.stringify(obj),
						token,
					},
					success: (res) => {
						uni.hideLoading()
						console.log(res.data)
						this.disabled = false
						this.formData = res.data.group_seek_transaction[0]
						this.types = type
						this.$refs.popup.open(type)
					}
				})
			},
			off(id) {
				var token = uni.getStorageSync('token')
				console.log(this.formData)
				if (id == 1) {
					uni.showLoading({
						title: '提交中...'
					})
					var group_message_buyer = {
						Group_Message_SerialNumber: "",
						Group_Transaction_SerialNumber: this.formData.Group_Transaction_SerialNumber,
						Cause: "已发货",
						Submission_Time: times.nowtime(),
						Enterprise_Info_SerialNumber: uni.getStorageSync('enterprise'),
						Seller_Type: "0"
					}
					this.formData.Row_Status = '5'
					let data = {
						Data: JSON.stringify({
							Modify: {
								group_seek_transaction: [this.formData]
							},
							Add: {
								group_seek_transaction_logistics: [this.group_seek_transaction_logistics],
								group_message: [group_message_buyer]
							}
						}),
						token
					}
					uni.request({ //确认招采信息
						url: app.globalData.Domain_Name + '/getEditAction',
						header: {
							'Content-Type': 'application/x-www-form-urlencoded'
						},
						method: "POST",
						data,
						success: (res) => {
							uni.hideLoading()
							console.log(res.data)
							this.disabled = false
							if (res.data.Status == 'success') {
								var value = '已发货'
								this.sendmessage(value)
								this.type='success'
								this.message = '已发货'
								this.LetterCommitment = true
								setTimeout(() => {
									this.LetterCommitment = false
									this.getList(this.form)
								}, 2000)
							}
						}
					})
				}
				this.$refs.popup.close()
			},
			ConfirmContract(item) { //确认合同
				this.disabled = true
				uni.showLoading({
					title: '提交中...'
				})
				var token = uni.getStorageSync('token')
				uni.request({ //确认招采信息
					url: app.globalData.Domain_Name + '/getGroupSeekProcureIDAction',
					header: {
						'Content-Type': 'application/x-www-form-urlencoded'
					},
					method: "POST",
					data: {
						Group_Seek_Purchase_SerialNumber: item.Group_Seek_Purchase_SerialNumber,
						token,
					},
					success: (res) => {
						console.log(res.data)
						this.form1 = res.data.Data
						this.getDetail(item.Group_Seek_Transaction_SerialNumber)
					}
				})
			},
			getDetail(Group_Seek_Transaction_SerialNumber) {
				var token = uni.getStorageSync('token')
				let obj = {
					// 采购信息表
					group_seek_transaction: {
						group_seek_transaction_paystages: {}
					}
				}
				uni.request({ //确认招采信息
					url: app.globalData.Domain_Name + '/getSubtableInquiryOriginal',
					header: {
						'Content-Type': 'application/x-www-form-urlencoded'
					},
					method: "POST",
					data: {
						Primary_Key: Group_Seek_Transaction_SerialNumber,
						JSONObject: JSON.stringify(obj),
						token,
					},
					success: (res) => {
						console.log(res.data)
						this.formData = res.data.group_seek_transaction[0]
						this.ConfirmContracts(token)
					}
				})
			},
			ConfirmContracts(token) {
				this.formData.Submission_Time = times.nowtime()
				this.formData.Enterprise_Info_SerialNumber = this.form1.Enterprise_Info_SerialNumber
				this.formData.Seller_Status = '4'
				console.log(this.formData)
				var group_seek_message = {
					Group_Message_SerialNumber: "",
					Group_Seek_Transaction_SerialNumber: this.formData.Group_Seek_Transaction_SerialNumber,
					Cause: "确认合同",
					Submission_Time: times,
					Enterprise_Info_SerialNumber: uni.getStorageSync('enterprise'),
					Seller_Type: "0"
				}
				let data = {
					Data: JSON.stringify({
						Modify: {
							group_seek_transaction: [this.formData]
						},
						Add: {
							group_seek_message: [group_seek_message]
						}
					}),
					token,
				}
				uni.request({ //确认招采信息合同
					url: app.globalData.Domain_Name + '/getEditAction',
					header: {
						'Content-Type': 'application/x-www-form-urlencoded'
					},
					method: "POST",
					data,
					success: (res) => {
						uni.hideLoading()
						console.log(res.data)
						this.disabled = false
						if(res.data.Status=='success'){
					        var value = '已确认合同'
					        this.sendmessage(value)
							this.type='success'
							this.message = '已确认合同'
							this.LetterCommitment = true
							setTimeout(()=>{
								this.getList(this.form)
								this.LetterCommitment = false
							},2000)
						}else{
							this.type='error'
							this.message = '操作失败,请重试'
							this.LetterCommitment = true
							setTimeout(()=>{
								this.LetterCommitment = false
							},2000)
						}
					}
				})
			},
			Detail(item){
				console.log(item.Group_Seek_Purchase_SerialNumber)
				this.active1 = !this.active1
				if(item==0){
					return
				}
				var token = uni.getStorageSync('token')
				uni.request({ //确认招采信息
					url: app.globalData.Domain_Name + '/getGroupSeekProcureIDAction',
					header: {
						'Content-Type': 'application/x-www-form-urlencoded'
					},
					method: "POST",
					data: {
						Group_Seek_Purchase_SerialNumber:item.Group_Seek_Purchase_SerialNumber,
						token,
					},
					success: (res) => {
						console.log(res.data)
						this.form2 = res.data.Data
					}
				})
			}
		}
	}
</script>

<style lang="scss">
	.active {
		color: #f00;
		border-bottom-color: #f00;
		border-bottom-width: 6rpx;
		border-bottom-style: solid;
	}
</style>